<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="../css/login.css" />
    <link rel="stylesheet" href="../font_nrci69s8ye8/iconfont.css" />
    <script src="../js/jquery.min.js"></script>
    <script src="../js/axios.min.js"></script>
    <script src="../js/API.js"></script>
    <script src="../js/code.js"></script>
    <style type="text/css">
      /* * {
        box-sizing: border-box;
      } */
      #canvas {
        display: inline-block;
        border: 1px solid #000;
        border-left: none;
        cursor: pointer;
        width: 160px;
        height: 46px;
        margin-top: 20px;
      }
      #canvas{
        float: right;
        position: absolute;
        top: 434px;
        left: 1286px;
      }
    </style>
  </head>
  <body>
    <!-- 外延 -->
    <div class="extension">
      <!-- 导航栏 -->
      <div class="f_header_wp">
        <div class="u_top_logo"></div>
        <div class="f_nav_lst">
          <a href="">钻石</a> 
          <a href="">钻戒</a>
          <a href="">对戒</a>
          <a href="">配饰</a>
          <a href="">定制</a>
          <a href="">品牌故事</a>
          <a href="">体验中心</a>
        </div>
        <div class="f_headeroth_wp">
          <div class="f_ser_wp">
            <span class="iconfont icon-fangdajing"></span>
          </div>
          <a href="" class="icon_car"></a>
          <a href="" class="icon_mycenter">我的鸟巢</a>
        </div>
      </div>
    </div>

    <!-- 侧边固定 -->
    <div class="services">
      <span class="ser_lnk1"></span>
      <a href="" class="ser_lnk2">
        <span class="cart_count">0</span>
      </a>
    </div>
    <!-- body -->
    <div class="auth_bor">
      <!-- 左边图片 -->
      <img src="../img/bg.jpg" alt="" class="bg" />
      <!-- 右侧布局 -->
      <div class="right_bor">
        <div class="auth_title">
          <div class="phone_login" onclick="change('zhuce')">注册登录</div>
          <div class="password_login" onclick="change('denglu')">密码登录</div>
        </div>
        <!-- 注册登录方式 -->
        <div class="phoneandpassword" id="zhuce">
          <input type="text" placeholder="请输入手机号" onblur="checkPhoneFormat()" id="phone" />
          <input type="password" placeholder="请输入密码" id="password" onblur="validatePassword()">
          <input
            type="text"
            placeholder="请输入数字"
            id="checker_txing"
            class="input-val"
          />
          <canvas id="canvas" width="100" height="43"></canvas>
          <input type="text" placeholder="验证码" id="checker_str" />
          <input type="button" id="get_checknum" value="获取验证码" onclick="SMS();"/>
          <input type="button" id="logphone_submit" value="注册" onclick="submit();"/>
        </div>
      
        <!-- 密码登录方式 -->
        <div class="phoneandpassword" style="display: none;" id="denglu">
          <input type="text" id="phone2" placeholder="手机号/邮箱"  />
          <input type="password" placeholder="密码" id="password_str" />
          <div class="clearHeight" style="height: 15px"></div>
          <input type="checkbox" class="auth_checkbox" />
          <a href="" class="forgetpassword">忘记密码</a>
          <input
            type="button"
            class="log_btn"
            id="logpassword_submit"
            value="登录"
            style="margin-top: 16px"
            onclick="loginID()"
          />
          <div class="clearHeight" style="height: 15px"></div>
          <a href="" class="weixin-btn">
            <img src="../img/weixin.jpg" alt="" class="weixin" />
            <div class="dl_txt">微信登录</div>
          </a>
          <div class="dl_line"></div>
          <a href="" class="qq-btn">
            <img src="../img/qq.jpg" alt="" class="qq" />
            <div class="dl_txt">QQ登录</div>
          </a>
        </div>
        </div>
      </div>
    </div>

    <!-- footer -->
    <div class="g_ftpink_wp">
      <div class="g_ftbor_wp">
        <!-- 右边小程序图片 -->
        <div class="g_codepic_wp"></div>
        <div class="g_footer_wp">
          <!-- 第一列 -->
          <div class="footer_lnk_lst">
            <b>关于我们</b>
            <a href="">品牌简介</a>
            <a href="">市场合作</a>
            <a href="">诚聘贤才</a>
            <a href="">商务加盟</a>
          </div>
          <div class="footer_lnk_lst">
            <b>关于我们</b>
            <a href="">定金规则</a>
            <a href="">定制时间</a>
            <a href="">货品包装</a>
            <a href="">智能定制</a>
            <a href="">钻石课堂</a>
          </div>
          <div class="footer_lnk_lst">
            <b>支付与物流</b>
            <a href="">在线支付</a>
            <a href="">银行转账</a>
            <a href="">海外汇款</a>
            <a href="">体验中心自提</a>
            <a href="">免费配送</a>
          </div>
          <div class="footer_lnk_lst">
            <b>售后服务</b>
            <a href="">会员细则</a>
            <a href="">15天退换货</a>
            <a href="">以小换大</a>
            <a href="">优惠换款</a>
            <a href="">售后服务</a>
          </div>
        </div>

        <!-- 小字 -->
        <div class="ft_friend_info">
          <div>
            <a href="">全部热词</a>
            <a href="">网站地图</a>
            <a href="">在线投诉</a>
            <a href="">&nbsp;&nbsp;备案号：沪ICP备08011593号</a>
            "| Copyright © 2002-2021 www.zbird.com 钻石小鸟&nbsp; All Rights
            Reserved. "
          </div>
          <p>
            上海铂利德钻石有限公司&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;021-26011188
          </p>
        </div>

        <!-- 小图 -->
        <div class="ft_img_info">
          <a href="">
            <img src="../img/fot_certi.gif" alt="" width="90" height="30" />
          </a>
          <a href="">
            <img src="../img/fot_certi_02.jpg" alt="" width="90" height="30" />
          </a>
          <a href="">
            <img src="../img/fot_certi_03.jpg" alt="" width="90" height="30" />
          </a>
          <a href="">
            <img src="../img/fot_certi_04.jpg" alt="" width="90" height="30" />
          </a>
          <a href="">
            <img src="../img/picp_bg.png" alt="" width="90" height="30" />
          </a>
        </div>
      </div>
    </div>
    <script src="../js/login.js"></script>
    <script src="../js/register.js"></script>
  </body>
</html>
